<template>
<div>
<el-row>
    <div align="center"><h1>k8s可用端口申请页面</h1></div>
</el-row>

<el-row>
  <el-col :span="2"><div class="grid-content bg-purple">&nbsp;</div></el-col>
  <el-col :span="6"><div class="grid-content">
   <h3> 选择端口数量</h3>
    <el-input-number v-model="num"  :min="1" :max="100" label="描述文字" style="width: 100%" ></el-input-number>
    <br><br><br><br>
    <el-button type="primary" style="width:50%" @click="open">端口申请</el-button>
  </div></el-col>
  <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
  <el-col :span="6"><div class="grid-content">
    <h3> 2.选择Namespace</h3>
    <el-select v-model="value" placeholder="请选择" style="width: 100%">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
   </el-select>  
    </div></el-col>
</el-row>

<br><br>
<el-row>
  <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
  <el-col :span="4"><div class="grid-content" v-html="message2">

    </div></el-col>
</el-row>




</div>
</template>

<script>
import { K8sPodApplication } from '@/api/query'

export default {
  data() {
    return {
      options: [{
          value: '1',
          label: '指易'
        }, {
          value: '2',
          label: '冒泡'
        }, {
          value: '3',
          label: '其他'
        }],
        value: '1',
        num: '1',
        namespace:'',
        message2:''
    };
  },
  methods: {
    open() {
      K8sPodApplication({ "ports": this.num,"namespace": this.value }).then(response => {
        this.message2 = response.data.join(',')
      })
    },

  },
// mounted() {
//     window.addEventListener('load', () => { 
//           if (this.$route.path !== '/') {
//                 this.$router.replace('/')
//           }
//     })
// }
};
</script>

<style>
/* .box{
    width: 100%;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
} */
.el-col {
  min-height: 1px
}
</style>